<template>
  <mt-swipe :auto="8000">
    <mt-swipe-item><img src="../assets/banner.jpg"></mt-swipe-item>
    <mt-swipe-item><img src="../assets/banner.jpg"></mt-swipe-item>
    <mt-swipe-item><img src="../assets/banner.jpg"></mt-swipe-item>
    <mt-swipe-item><img src="../assets/banner.jpg"></mt-swipe-item>
    <mt-swipe-item><img src="../assets/banner.jpg"></mt-swipe-item>
    <mt-swipe-item><img src="../assets/banner.jpg"></mt-swipe-item>
  </mt-swipe>
</template>

<script>
import { Swipe, SwipeItem } from 'mint-ui'
export default {
  components: {
    mtSwipe: Swipe,
    mtSwipeItem: SwipeItem
  }
}
</script>

<style>
 .mint-swipe { margin: 0 auto; width: 95%; height:145px; border-radius: 5px; }
 .mint-swipe-items-wrap > div { text-align: center; width:100%; overflow: hidden;}
 .mint-swipe-items-wrap > div img { height: 100%; border-radius: 5px;}
 .mint-swipe-indicators { bottom:6px;}
 .mint-swipe-indicator.is-active { background: #ffbe04; opacity: 1;}
 </style>
